<template>
<div class="system-dep">
    <div class="control-box">
        <el-button size="small" type="primary" @click="addDep"><i class="el-icon-circle-plus-outline"></i>新增部门</el-button>
        <el-button size="small" @click="deleteDep">删除</el-button>
    </div>
    <table-list @change="changeDep"></table-list>
    <management :showDialog="showDialog" :types="types" @close="showDialog = false"></management>
</div>
</template>
<script>
import Management from './Management'
import tableList from './TableList'
export default {
    name: 'dep',
    components: {
        Management,
        tableList
    },
    data () {
        return {
            types: 0,
            showDialog: false
        }
    },
    methods: {
        change () {
        },
        addDep () {
            this.types = 1
            this.showDialog = true
        },
        changeDep (data) {
            this.types = 0
            this.showDialog = true
        },
        deleteDep () {
            this.$message({
                message: '请选择部门',
                type: 'warning'
            })
        }
    }
}
</script>

<style lang="less">
.system-dep {
    background: #fff;
    padding: 0 10px;
    .control-box{
        padding: 20px 0;
        text-align: right;
    }
    .expand-box {
        .el-row {
            .el-col {
                text-align: center;
            }
        }
    }
}
</style>
